<!DOCTYPE HTML>
<html>

  <head>
    <meta charset="UTF-8">
    <link rel="shortcut icon" href="#">
    <link rel="stylesheet" type="text/css" href="/static/jquery-ui.min.css"/>
    <link rel="stylesheet" type="text/css" href="/static/jquery.dataTables.min.css"/>
    <link rel="stylesheet" type="text/css" href="/static/highlight.github.min.css"/>
    <style>
      body {
        font-family: "Trebuchet MS", sans-serif;
        margin: 50px;
      }
      .chart {
        height: 700px; max-width: 920px; margin: 0px auto;
      }
    </style>
  </head>

  <body>
    <h1 id="heading-title">Title</h1>
    <div>
      Available benchmarks:
      <ul id="toc"></ul>
    </div>
    <div id="bm-results"></div>
    <div><pre id="dbg"></pre></div>
    <!-- scripts -->
    <script type="text/javascript" src="/static/jquery-3.3.1.min.js"></script>
    <script type="text/javascript" src="/static/jquery-ui.js"></script>
    <script type="text/javascript" src="/static/jquery.canvasjs.min.js"></script>
    <script type="text/javascript" src="/static/Chart.min.js"></script>
    <script type="text/javascript" src="/static/jquery.dataTables.min.js"></script>
    <script type="text/javascript" src="/static/highlight.min.js"></script>
    <script type="text/javascript" src="/bm.js"></script>
    <script type="text/javascript">
      $(document).ready(function() {
        $.getJSON('/manifest.json', function(specs){
          loadSpecs(specs);
        })
      });
    </script>
  </body>
</html>
